import {Component} from 'react';
import React from 'react';
import {connect} from 'umi';
// @ts-ignore
import {FormValueType} from '@/pages/ListTableList/components/UpdateForm';
import HighPerformTable from '@/components/HighPerformTable';
import {Card, Col, Row, Statistic} from 'antd';
import APIS from '@/apis';

class CourseStat extends Component<any, any> {
  actionRef: any;
  state = {
    duringReview: 0,
    total: 0,
    passedReview: 0,
    banCount: 0
  }

  requestGetData(
    params: {
      pageSize?: number;
      current?: number;
    },
    sorter: {
      [key: string]: 'ascend' | 'descend';
    },
    filter: {
      [key: string]: React.ReactText[];
    },
  ) {
    return APIS.StatAPI.GetStatCourse({...params, sorter, filter}).then((res) => {
      var data = res.courses
      const result = {
        data: data.records,
        total: data.total,
        success: true,
        pageSize: data.size,
        current: parseInt(`${data.current}`, 10) || 1,
      };
      this.setState({
        duringReview: res.duringReview,
        passedReview: res.passedReview,
        total: res.total,
        banCount: res.ban
      })
      return result;
    });
  }

  handleUpdateModalVisible(value: boolean) {
  }

  handleUpdate(value: FormValueType) {
    return false;
  }

  clomns: any = [
    {
      title: '课程名称',
      dataIndex: 'courseName',
      rules: [
        {
          required: true,
          message: '试卷名称为必填项',
        },
      ],
    },
    {
      title: '课程分类',
      dataIndex: 'type',
      valueType: 'textarea',
    },
    {
      title: '课程状态',
      dataIndex: 'state',
      render: (a, r) => {
        switch (r.state) {
          case 0:
            return "禁用"
          case 1:
            return "上线"
          case 2:
            return "待提交"
          case 3:
            return "审核中"
          case 4:
            return "审核失败"
          case 5:
            return "待发布"
        }
        return ""
      }
    },
    {
      title: '更新时间',
      dataIndex: 'updatedTime',
      hideInForm: true,
    },
  ];

  render() {
    return (
      <div>
        <Row gutter={16}>
          <Col span={6}>
            <Card>
              <Statistic
                title="课程数量"
                value={this.state.total}
                // precision={2}
                valueStyle={{color: '#3f8600'}}
                // prefix={<ArrowUpOutlined />}
                // suffix="人"
              />
            </Card>
          </Col>
          <Col span={6}>
            <Card>
              <Statistic
                title="已上线"
                value={this.state.passedReview}
                // precision={2}
                valueStyle={{color: '#cf1322'}}
                // prefix={<SmileTwoTone />}
                // suffix="人"
              />
            </Card>
          </Col>
          <Col span={6}>
            <Card>
              <Statistic
                title="正在审核"
                value={this.state.duringReview}
                // precision={2}
                valueStyle={{color: '#cf1322'}}
                // prefix={<MehTwoTone />}
                // suffix="人"
              />
            </Card>
          </Col>
          <Col span={6}>
            <Card>
              <Statistic
                title="被禁用"
                value={this.state.banCount}
                // precision={2}
                valueStyle={{color: '#cf1322'}}
                // prefix={<MehTwoTone />}
                // suffix="人"
              />
            </Card>
          </Col>
        </Row>
        <HighPerformTable<any>
          columns={this.clomns}
          requestGetData={this.requestGetData.bind(this)}
          ref={(ref) => (this.actionRef = ref)}
          hideOptions
          action
        />
      </div>
    );
  }
}

export default connect()(CourseStat);
